/* eslint-disable react/no-array-index-key */
/**
 * 简历查重-简历对比
 */

import React, { memo } from 'react';
import { PageContainer } from '@/molecules';
import { Col, Descriptions, Divider, Row, Spin } from 'antd';
import { DetailItem, ExperienceDescription } from '@/pages/Recruitment/components';
import { getDict, getDisplayText } from '@/utils/dataDictUtil';
import { ABILITY_LEVEL } from '@/pages/Recruitment/dictionary';
import moment from 'moment';
import TalentInfoHead from '@/pages/Recruitment/components/TalentInfoHead';
import isEmpty from 'lodash/isEmpty';
import { defaultFormatResult, useRequest } from '@/hooks';
import { getResumesDetail } from '@/pages/Recruitment/service';
import styles from './Compare.less';

const Detail = memo(({ talentStandardData = {} }) => {
    const { talentStandardDetailVO = {}, talentNativePlace, createTime } = talentStandardData;
    const [industryTypeList, setIndustryType] = React.useState([]);
    const [agreeTypeList, setAgreeTypeList] = React.useState([]);
    const [recruitTalentLangTypeList, setRecruitTalentLangTypeList] = React.useState([]);
    const format = (d, formatStr) => moment(d).format(formatStr);
    const renderTimeRegion = (from, to, formatStr) => {
        if (!from) {
            return '';
        }

        const f = format(from, formatStr);
        const t = to ? format(to, formatStr) : '至今';
        return <span style={{ color: 'rgba(0,0,0,0.45)', fontSize: 12 }}>{`${f} - ${t}`}</span>;
    };
    const {
        talentIdCard = '',
        talentWorkDetailVOList = [], // 工作
        talentEduDetailVOList = [], // 教育
        resumeAttachmentList = [], // 附件
        talentProjectDetailVOList = [], // 项目
        talentTrainDetailVOList = [], // 培训
        talentCertificateDetailVOList = [], // 证书
        talentSkillDetailVOList = [], // 技能
        talentLangDetailVOList = [] // 语言能力
    } = talentStandardDetailVO;
    const renderInfoHead = () => (
        <div style={{ marginBottom: 16 }}>
            <TalentInfoHead talent={talentStandardData} />
        </div>
    );
    const renderInfo = () => {
        if (!talentIdCard && !talentNativePlace) {
            return '';
        }
        return (
            <>
                <Descriptions title="个人信息" column={2}>
                    {talentIdCard && <Descriptions.Item label="证件号码">{talentIdCard || '--'}</Descriptions.Item>}
                    {talentNativePlace && (
                        <Descriptions.Item label="国籍/户籍">
                            {talentNativePlace?.split(',').join('/')}
                        </Descriptions.Item>
                    )}
                </Descriptions>
                <Divider />
            </>
        );
    };
    const renderWork = () => {
        if (!talentWorkDetailVOList.length) {
            return '';
        }
        return (
            <>
                <Descriptions title="工作经历" />
                {talentWorkDetailVOList.map((item, index) => (
                    <React.Fragment key={index}>
                        {index !== 0 && <div style={{ marginTop: 40 }} />}
                        <ExperienceDescription
                            showAvatar={false}
                            major={[item.companyName, renderTimeRegion(item.startTime, item.endTime, 'YYYY.MM')]}
                            secondary={[
                                item.positionName,
                                item.industryType
                                    ? `所属行业：${getDisplayText(industryTypeList, item.industryType)}`
                                    : ''
                            ]}
                            extra={item.leaveReason && <div>离职原因：{item.leaveReason}</div>}
                            description={[{ content: item.workDesc && item.workDesc.split('\n') }]}
                        />
                    </React.Fragment>
                ))}
                <Divider />
            </>
        );
    };
    const renderProject = () => {
        if (!talentProjectDetailVOList.length) {
            return '';
        }
        return (
            <>
                <Descriptions title="项目经验" />
                {talentProjectDetailVOList.map((item, index) => (
                    <React.Fragment key={index}>
                        {index !== 0 && <div style={{ marginTop: 40 }} />}
                        <ExperienceDescription
                            showAvatar={false}
                            major={[item.projectName, renderTimeRegion(item.startTime, item.endTime, 'YYYY.MM')]}
                            description={[
                                { title: '项目描述', content: item.projectDesc && item.projectDesc.split('\n') },
                                {
                                    title: '项目中职责',
                                    content: item.projectWorkDesc && item.projectWorkDesc.split('\n')
                                }
                            ]}
                        />
                    </React.Fragment>
                ))}
                <Divider />
            </>
        );
    };
    const renderEdu = () => {
        if (!talentEduDetailVOList.length) {
            return '';
        }
        const fetchSecondary = (degree, major) => [degree, major].filter(_ => _).join(' / ');
        return (
            <>
                <Descriptions title="教育背景" />
                {talentEduDetailVOList.map((item, index) => (
                    <React.Fragment key={index}>
                        {index !== 0 && <div style={{ marginTop: 40 }} />}
                        <ExperienceDescription
                            icon={
                                <i
                                    className="icon iconfont iconlist_school_icon_default1"
                                    style={{ fontSize: '32px' }}
                                />
                            }
                            avatar={item.avatar}
                            major={[item.graduateSchool, renderTimeRegion(item.startTime, item.endTime, 'YYYY')]}
                            secondary={[fetchSecondary(getDisplayText(agreeTypeList, item.degree), item.major)]}
                        />
                    </React.Fragment>
                ))}
                <Divider />
            </>
        );
    };
    const renderTrain = () => {
        if (!talentTrainDetailVOList.length) {
            return '';
        }
        return (
            <>
                <Descriptions title="培训经历" />
                {talentTrainDetailVOList.map((item, index) => (
                    <React.Fragment key={index}>
                        {index !== 0 && <div style={{ marginTop: 40 }} />}
                        <ExperienceDescription
                            showAvatar={false}
                            major={[item.trainOrganize, renderTimeRegion(item.startTime, item.endTime, 'YYYY')]}
                            description={[{ content: item.trainContent && item.trainContent.split('\n') }]}
                        />
                    </React.Fragment>
                ))}
                <Divider />
            </>
        );
    };
    const renderCertificate = () => {
        if (!talentCertificateDetailVOList.length) {
            return '';
        }
        return (
            <>
                <Descriptions title="获得证书" />
                {talentCertificateDetailVOList.map((item, index) => (
                    <React.Fragment key={index}>
                        {index !== 0 && <div style={{ marginTop: 40 }} />}
                        <ExperienceDescription
                            showAvatar={false}
                            major={[item.certificateName, format(item.certificateTime, 'YYYY.MM')]}
                        />
                    </React.Fragment>
                ))}
                <Divider />
            </>
        );
    };
    const renderSkill = () => {
        if (!talentSkillDetailVOList.length) {
            return '';
        }
        return (
            <>
                <Descriptions title="专业技能" />
                {talentSkillDetailVOList
                    .filter(item => item.skillName)
                    .map((item, index) => (
                        <div key={index}>
                            {index !== 0 && <div style={{ marginTop: 10 }} />}
                            <Row style={{ marginLeft: 12 }}>
                                <Col span={8}>
                                    <DetailItem>{item.skillName}</DetailItem>
                                </Col>
                                <Col span={8}>
                                    <DetailItem label="掌握程度" style={{ flex: 1 }}>
                                        {getDisplayText(ABILITY_LEVEL, item.proficiency) || '-'}
                                    </DetailItem>
                                </Col>
                                <Col span={8}>
                                    <DetailItem label="使用时长">
                                        {item.skillDuration ? `${item.skillDuration}月` : '-'}
                                    </DetailItem>
                                </Col>
                            </Row>
                        </div>
                    ))}
                <Divider />
            </>
        );
    };
    const renderLang = () => {
        if (!talentLangDetailVOList.length) {
            return '';
        }
        return (
            <>
                <Descriptions title="语言能力" />
                {talentLangDetailVOList
                    .filter(item => item.langType)
                    .map((item, index) => (
                        <div key={index}>
                            {index !== 0 && <div style={{ marginTop: 10 }} />}
                            <Row key={index} style={{ marginLeft: 12 }}>
                                <Col span={8}>
                                    <DetailItem>{getDisplayText(recruitTalentLangTypeList, item.langType)}</DetailItem>
                                </Col>
                                <Col span={8}>
                                    <DetailItem label="听说能力" style={{ flex: 1 }}>
                                        {getDisplayText(ABILITY_LEVEL, item.listenSpeakAbility) || '-'}
                                    </DetailItem>
                                </Col>
                                <Col span={8}>
                                    <DetailItem label="读写能力">
                                        {getDisplayText(ABILITY_LEVEL, item.readWriteAbility) || '-'}
                                    </DetailItem>
                                </Col>
                            </Row>
                        </div>
                    ))}

                <Divider />
            </>
        );
    };
    const renderAttachment = () => {
        if (!resumeAttachmentList.length) {
            return '';
        }
        return (
            <>
                <Descriptions title="附件" />
                <Row>
                    {resumeAttachmentList.map((item, index) => {
                        const { originName, url } = item;
                        return (
                            <div key={index}>
                                {index !== 0 && <div style={{ marginTop: 10 }} />}
                                <Row type="flex" align="middle">
                                    <Col>
                                        <i
                                            className="icon iconfont iconyuanshijianli"
                                            style={{ color: 'rgba(0, 0, 0, 0.25)', fontSize: '16px' }}
                                        />
                                    </Col>
                                    <a
                                        rel="noopener noreferrer"
                                        href={url}
                                        download
                                        style={{
                                            marginLeft: '12px',
                                            cursor: 'pointer',
                                            color: 'rgba(0, 0, 0, 0.85)'
                                        }}
                                    >
                                        <span>{originName}</span>
                                    </a>
                                </Row>
                            </div>
                        );
                    })}
                </Row>
                <Divider />
            </>
        );
    };
    // 字典获取
    React.useEffect(() => {
        getDict('agreeType').then(ret => setAgreeTypeList(ret));
        getDict('industryType').then(res => setIndustryType(res));
        getDict('recruitTalentLangType').then(res => setRecruitTalentLangTypeList(res));
    }, []);
    return (
        <Row className={styles.resumeDetailWrapper}>
            {renderInfoHead()}
            {renderInfo()}
            {renderWork()}
            {renderProject()}
            {renderEdu()}
            {renderTrain()}
            {renderCertificate()}
            {renderLang()}
            {renderSkill()}
            {renderAttachment()}
            <Descriptions title="入库情况" column={2}>
                <Descriptions.Item label="入库时间">{format(createTime, 'YYYY-MM-DD HH:mm')}</Descriptions.Item>
            </Descriptions>
        </Row>
    );
});
const getResumeData = (data = {}) => {
    if (!isEmpty(data)) {
        const { talentStandardSaveDTO = {} } = data;
        const talentAge = talentStandardSaveDTO.talentBirth
            ? moment.duration(moment().diff(talentStandardSaveDTO.talentBirth)).years() + 1
            : '';
        const talentWorkYearNum = talentStandardSaveDTO.talentStartWorkTime
            ? moment.duration(moment().diff(talentStandardSaveDTO.talentStartWorkTime)).years()
            : '';
        return {
            ...data,
            ...data.talentStandardSaveDTO,
            talentAge,
            talentWorkYearNum,
            talentNativePlace: talentStandardSaveDTO.talentNativePlace,
            talentStandardDetailVO: {
                talentWorkDetailVOList: talentStandardSaveDTO.talentWorkSaveDTOList, // 工作经历
                talentProjectDetailVOList: talentStandardSaveDTO.talentProjectSaveDTOList, // 项目经历
                talentEduDetailVOList: talentStandardSaveDTO.talentEduSaveDTOList, // 教育经历
                talentTrainDetailVOList: talentStandardSaveDTO.talentTrainSaveDTOList, // 培训经历
                talentCertificateDetailVOList: talentStandardSaveDTO.talentCertificateSaveDTOList, // 获得证书
                talentSkillDetailVOList: talentStandardSaveDTO.talentSkillSaveDTOList, // 专业能力
                talentLangDetailVOList: talentStandardSaveDTO.talentLangSaveDTOList // 语言能力
            }
        };
    }
    return {};
};
const Compare = ({ location }) => {
    const { query } = location;
    const newResumeData = sessionStorage.getItem('__NEW_RESUME_DATA__')
        ? getResumeData(JSON.parse(sessionStorage.getItem('__NEW_RESUME_DATA__')))
        : {};
    const { data: oldResumeData, loading } = useRequest(() => getResumesDetail(query.resumeId), {
        ...defaultFormatResult
    });
    return (
        <PageContainer>
            <Spin spinning={loading}>
                <div className={styles.resumeWrap}>
                    <div className={styles.resumeList}>
                        <div className={styles.title}>
                            <i className="icon iconfont iconbiaozhunjianli" style={{ marginRight: 4 }} />
                            导入简历
                        </div>
                        <Detail talentStandardData={newResumeData} />
                    </div>
                    <div className={styles.resumeList}>
                        <div className={styles.title}>
                            <i className="icon iconfont iconbiaozhunjianli" style={{ marginRight: 4 }} />
                            系统简历
                        </div>
                        <Detail talentStandardData={oldResumeData} />
                    </div>
                </div>
            </Spin>
        </PageContainer>
    );
};

export default Compare;
